// 一、匹配模式 ：类似 js里的 switch ...case ... ;
// .common(@_){
//     // 公共样式 
//     width: 100px;
//     height: 100px;
// }
// .common(redcolor){
//     background-color: red;
// }

// .common(bluecolor){
//     background-color: blue;
// }

// .common(pinkcolor){
//     background-color: pink;
// }

// .box{
//     .common(bluecolor);
// }

// .box2{
//     .common(pinkcolor);
//     border: 1px solid;
// }

// 二、重载  ：根据参数的不同 调用不同的函数 ；

.common(@w){
    width: @w;
    height: 100px;
}

.common(@w,@h){
    width: @w;
    height: @h;
}

.common(@w,@h,@b){
    width: @w;
    height: @h;
    border:@b
}

.box1{
    .common(300px,200px);
}


.box2{
    .common(400px);
}
.box3{
    .common(100px,200px,1px solid);
}
